import React, { Component } from 'react';
import styles from './balance.module.scss';
import { withRouter } from "react-router-dom";
import img from '../../assets/login1.jpg';

class Balance extends Component {
    handleMyClick = (params) => {
        this.props.history.push("about")
    }
    render() {
        return (
            <div className={styles.elemeBalance}>
                {/* elemeBalanceHead start */}
                <div className={styles.elemeBalanceHead}>
                <span className={styles.elemeServiceHeadLeft} onClick={this.handleMyClick}>&lt;</span>
                    <span className={styles.elemeServiceHeadTitle}>
                    我的余额
                    </span>
                </div>
                {/* elemeBalanceHead start */}

                {/* elemeBalanceTop start */}
                <div className={styles.elemeBalanceTop}>
                    <div className={styles.elemeBalanceTopBox}>
                        <div className={styles.elemeBalanceTopBox1}>
                            <p className={styles.TopBox1Left}>
                                当前余额
                            </p>
                            <p className={styles.TopBox1right}>
                                余额说明
                            </p>
                        </div>
                        <div className={styles.elemeBalanceTopBox2}>
                            <span className={styles.TopBox2Data}>
                                0.00
                            </span>
                            元
                        </div>
                        <div className={styles.elemeBalanceTopBox3}>
                            <button>提 交</button>
                        </div>
                    </div>
                </div>
                {/* elemeBalanceTop end */}

                {/* elemeBalanceContent start */}
                <div className={styles.elemeBalanceContent}>
                    <div className={styles.content1}>
                        交易明细
                    </div>
                    <div className={styles.content2}>
                        <div className={styles.content2img}>
                            <img src={img} alt=""></img>
                        </div>
                        暂无明细记录
                    </div>
                </div>
                {/* elemeBalanceContent end */}
            </div>
        )
    }
}

export default withRouter(Balance);